<template>
  <div>
    <div class="center">
		<div class="header">
		  <div class="logo">
			<img src="../../public/img/logo_top.png">
		  </div>
		  <div class="nav">
			<div class="biao1">
			  <router-link to="/"><p>服务案列</p></router-link>
			  <ul>
				<li @click="huan(1)">企业</li>
				<li @click="huan(2)">市政单位</li>
				<li @click="huan(3)">高校</li>
			  </ul>
			</div>
			<div class="biao1">
			  <p>产品介绍</p>
			  <ul>
				<li><a href="">内容</a></li>
				<li><a href="">产品</a></li>
				<li><a href="">服务</a></li>
				<li><a href="">智能硬件</a></li>
			  </ul>
			</div>
			<div class="biao1">
				<p><router-link to="/aboutus"><a href="">关于我们</a></router-link></p>
			</div>
		  </div>
		  <div class="you">
			<span class="nav_list">
			  <a href="">电脑端体验</a>
			</span>
			<span class="nav_item">
			  <a href="">移动端体验</a>
			  <i>
				<img src="../../public/img/zhangyue_ma.png">
			  </i>
			</span>
			<button class="btn">申请使用</button>
		  </div>
		</div>
	  </div>
      <!-- banner -->
      <div class="banner">
        <div>
          <h1>客户服务案例</h1>
          <p>掌阅精选机构服务，专注政企数字阅读</p>
          <span>免费体验</span>
        </div>
        <img src="../../public/img/banner1.png" alt="" v-if="i==1" />
        <img src="../../public/img/banner2.png" alt="" v-else-if="i==2" />
        <img src="../../public/img/banner3.png" alt="" v-else-if="i==3" />
      </div>
      <!-- 中间的图和配文 -->
      <div id="case">
        <ul class="tabBar">
          <li  @click="huan(1)">企业</li>
          <li  @click="huan(2)">市政单位</li>
          <li  @click="huan(3)">高校</li>
        </ul>
        <div class="main">
          <ul class="company"  v-if="i==1">
            <li class="main-item">
              <img
                alt="北京快手科技有限公司"
                src="../../public/img/kuaishou.png"
              />
              <div>
                <h3>北京快手科技有限公司</h3>
                <h4>客户介绍</h4>
                <p>
                  快手是记录和分享大家生活的平台，全球员工数量达两万人，日活跃用户数突破3亿。多年来快手一直将互联网思维融入党建工作，坚持将党建和业务相结合，推出多个传播社会主义核心价值观的正能量专题；公司也一直积极完善各项制度，充分发挥党组织的核心作用和党员先锋模范带头作用。
                </p>
                <h4>客户评价</h4>
                <p>
                  快手党建需要一个可以系统学习党的思想和著作的平台，可以调动党员学习氛围，在党建会议和活动外，日常也能帮助党员快速获得党的学习指导信息，使公司党建工作进行更顺利，党员学习更方便更有效。作为第一届支部委员会，响应中央加强新时代党建信息化建设号召，快手和掌阅的合作，希望掌阅的数字阅读让党员在信息传递和学习教育方面有所提升。
                </p>
              </div>
            </li>
            <li class="main-item">
              <img
                alt="FESCO北京外企人力资源服务有限公司"
                src="../../public/img/hezuofang3.png"
              />
              <div>
                <h3>FESCO北京外企人力资源服务有限公司</h3>
                <h4>客户介绍</h4>
                <p>
                  北京外企人力资源服务有限公司（以下简称FESCO），成立于1979年，是中国率先为外商驻华代表机构、外商金融机构、经济组织提供专业化人力资源服务的公司。服务40000+企业客户，是中国人力资源业界最具竞争力和品牌价值的企业，中国500强企业之一。
                </p>
                <h4>客户评价</h4>
                <p>
                  随着业务不断壮大，FESCO对培养提升员工素质，提出了更高的要求。为此FESCO工会采购了掌阅精选线上阅读产品，希望为公司员工提供一个轻松、便捷、高质的阅读方式，同时可以帮助员工提高个人能力，增强企业竞争力，打造更有价值的智慧人力服务组织。
                </p>
              </div>
            </li>
            <li class="main-item">
              <img
                alt="亚信科技控股有限公司"
                src="../../public/img/hezuofang13.png"
              />
              <div>
                <h3>亚信科技控股有限公司</h3>
                <h4>客户介绍</h4>
                <p>
                  亚信科技控股有限公司（简称：亚信科技，股票代码：01675.HK）始于1993年，是领先的软件产品、解决方案和服务提供商，致力于成为大型企业数字化转型的使能者。
                  亚信科技对IT及网络环境以及业务运营需求有着深度理解，拥有500多种高可靠性、高稳定性、高可用性的“电信级”软件产品组合，包括AI²人工智能平台、AIF
                  PaaS平台、计费产品、大数据产品、客户关系管理产品、5G网络智能化产品、开发运维一体化产品、数据库产品等全套AISWare产品体系，并通过了CMMI
                  5级（软件能力成熟度模型集成五级）国际认证。
                </p>
                <h4>客户评价</h4>
                <p>
                  作为数字化转型的使能者，在企业内部布局数字阅读，亚信在企业培养提升员工能力和团队凝聚力提升的方向上提出了更高的要求。亚信科技和掌阅精选合作，掌阅为其搭建亚信图书馆，亚信成立了AI阅读读书会，建立了AI阅读读书群，每月推出一份员工荐读的书单进行共读和笔记输出，有效的调动了内部员工阅读的输入和输出。基于阅读爱好，挖掘了内部爱阅读爱分享的亚信村里人，并将AI分享的精神传递给更多的亚信人，企业文化让爱无处不在的愿景体现的淋漓尽致。
                </p>
              </div>
            </li>
            <li class="main-item">
              <img alt="中国光大银行" src="../../public/img/hezuofang5.png" />
              <div>
                <h3>中国光大银行</h3>
                <h4>客户介绍</h4>
                <p>
                  中国光大银行（CHINAEVERBRIGHT
                  BANK、光大银行）成立于1992年8月，是经国务院批复并经中国人民银行批准设立的全国性股份制商业银行，总部设在北京。中国光大银行于2010年8月在上海证券交易所挂牌上市、2013年12月在香港联合交易所挂牌上市。
                </p>
                <h4>客户评价</h4>
                <p>
                  值得纪念的是，光大银行与掌阅精选的合作开展是在一年一度的八一建军节，通过H5和APP对接的形式，中国光大银行职工书屋正式上线。为深入贯彻总行党委创建学习型银行的战略部署，在全行范围内营造全员学习、高效学习的学习文化氛围，全面提升员工的学习热情和综合知识水平，打造学习型组织，同时为打造世界一流财富管理银行提供有力的文化保障，总行工会基于掌阅搭建的中国光大银行职工书屋在全辖范围内开展“2020年全员读书活动”。活动上线不到三天，注册人数高达51%。读书热情高涨，学习氛围浓厚。
                </p>
              </div>
            </li>
            <li class="main-item">
              <img
                alt="中国华冶科工集团有限公司"
                src="../../public/img/hezuofang9.png"
              />
              <div>
                <h3>中国华冶科工集团有限公司</h3>
                <h4>客户介绍</h4>
                <p>
                  中国华冶科工集团有限公司是世界500强大型企业集团——中国冶金科工集团的全资企业，根据公司工会2020年十届一次会员代表大会提出的工作思路和2020年全委会工作安排，为引导会员养成读书学习的良好习惯，进一步提高会员综合素质，在疫情期间更好地服务全体会员，2020年7月公司工会引入掌阅科技旗下掌阅精选电子书屋平台，命名为“华冶阅读”（华冶图书馆）。
                </p>
                <h4>客户评价</h4>
                <p>
                  阅读是员工成长的途径，阅读也将是企业发展的助推器。在华冶推动全员阅读时，面临图书资源有限、覆盖率低、无法跟踪员工阅读情况三大难题，为有针对性地解决这些问题，华冶选择了掌阅精选机构电子图书馆作为一站式解决方案引入，实现了全员覆盖。每月举行阅读之星争霸赛，培养读书好习惯。年末，公司工会选出读书时间长、读书本书多、读书笔记认真的若干会员，与先进工会工作者、先进工会积极分子一同表彰奖励。真正让大家做到多读书，读好书。
                </p>
              </div>
            </li>
            <li class="main-item">
              <img alt="钉钉" src="../../public/img/hezuofang2.png" />
              <div>
                <h3>钉钉</h3>
                <h4>客户介绍</h4>
                <p>
                  钉钉（DingTalk）是阿里巴巴集团专为中国企业打造的免费沟通和协同的多端平台，提供PC版，Web版，Mac版和手机版，支持手机和电脑间文件互传。钉钉因中国企业而生，帮助中国企业通过系统化的解决方案（微应用），全方位提升中国企业沟通和协同效率。
                </p>
                <h4>客户评价</h4>
                <p>
                  秉承让工作学习更简单的理念，掌阅精选的阅读学习模式让钉钉中学习的方式更加多元化，我们勇于探索新的模式，只为给用户带来更好的体验。
                </p>
              </div>
            </li>
          </ul>
          <ul class="administration"  v-else-if="i==2">
            <li class="main-item">
              <img
                src="../../public/img/hezuofang14.png"
                alt="网上全国政协书院"
              />
              <div>
                <h3>网上全国政协书院</h3>
                <h4>客户介绍</h4>
                <p>
                  2020年4月起，全国政协委员读书活动蓬勃开展，鼓励广大政协委员委员多读书、读好书、善读书。众多委员登录委员移动履职平台,走进网上“全国政协书院”看书、听书，通过读书学习增长知识、增加智慧，建设书香政协，更好的参政议政。
                </p>
                <h4>客户评价</h4>
                <p>
                  全国政协委员读书活动指导组，根据网上”全国政协书院”建设需求，丰富阅读资源，改善阅读体验，特向掌阅精选采购了优质电子图书、电子听书资源，助力委员队伍建设，做学习型政党。
                </p>
              </div>
            </li>
            <li class="main-item">
              <img src="../../public/img/hezuofang16.png" alt="中央党校" />
              <div>
                <h3>中央党校</h3>
                <h4>客户介绍</h4>
                <p>
                  中央党校是研究宣传习近平新时代中国特色社会主义思想、推进党的思想理论建设的重要阵地。为此中共中央党校图书和文化馆向掌阅精选采购了“新时代，新经典—学习习近平新时代中国特色社会主义思想重点电子书专栏”图书及多种好书。
                </p>
                <h4>客户评价</h4>
                <p>
                  掌阅精选“新时代
                  新经典”栏目系列中系列图书均由中宣部正版授权、后续同类型新书电子书优先发布，符合党校学员思想理论学习、不断开拓创新的学习需求，加之掌阅精选优质的阅读体验，为党校学员提供了高质、高效的党政学习服务。
                </p>
              </div>
            </li>
            <li class="main-item">
              <img src="../../public/img/hezuofang11.png" alt="首都图书馆" />
              <div>
                <h3>首都图书馆</h3>
                <h4>客户介绍</h4>
                <p>
                  《中国图书馆学会关于开展2020年全民阅读工作的通知》中指出，推进全民阅读也是满足人民文化需求的重要途径。首都图书馆是北京市全民阅读的主阵地，图书馆会员对图书的质量、线上读书体验非常重视。
                </p>
                <h4>客户评价</h4>
                <p>
                  为更好的保障北京市人民参与到全民阅读中去，掌阅精选同首都图书馆展开深度合作，按照首图提出的新书和畅销书要求，对书单进行精准匹配，内容中囊括了4年里近60%出版上市的新书、大奖书系。海量的社科类畅销图书，多终端对接技术支持。在丰富首都图书馆线上优质资源的同时，为助力首都图书馆提高国民科学文化素质、建设学习型社会，贡献自己的一份力量。
                </p>
              </div>
            </li>
            <li class="main-item">
              <img src="../../public/img/hezuofang8.png" alt="江苏省数字阅读" />
              <div>
                <h3>江苏省数字阅读</h3>
                <h4>客户介绍</h4>
                <p>
                  南京图书馆位于南京市玄武区，简称南图，是中国第三大图书馆、亚洲第四大图书馆，江苏省省级公共图书馆、首批全国古籍重点保护单位，国家一级图书馆、江苏省文献资源保障中心。
                </p>
                <h4>客户评价</h4>
                <p>
                  与掌阅科技达成合作，于2020年8月1日正式推出“百馆荐书，全省共读”阅读推广项目，依托掌阅精选的产品技术与服务，联合全省114家公共图书馆开展全民阅读活动。活动将每月推出精品电子图书及相关活动，向全省民众提供更加便捷的高品质数字阅读服务，引导读者多读书，读好书，共建书香江苏。在数字化、网络化、信息化的“互联网+”时代，南京图书馆为更好地履行全民阅读主阵地的职能，发挥省级公共图书馆的龙头作用，引导全省读者阅读的新方式。
                </p>
              </div>
            </li>
            <li class="main-item">
              <img
                src="../../public/img/hezuofang1.png"
                alt="朝阳预借电子图书馆"
              />
              <div>
                <h3>朝阳预借电子图书馆</h3>
                <h4>客户介绍</h4>
                <p>
                  “朝图预借”H5书城是朝阳区图书馆联合掌阅为市民定制的数字阅读服务产品，于2019年月10底正式上线，通过功能和内容定制等个性化服务，提供数字图书馆解决方案，免费为“朝图预借”公众号用户提供千余册优质出版电子书，丰富用户的阅读形式，提升阅读体验，协助推进“书香朝阳”建设。完美解决了群众如何选书及如何调动广大群众的积极性，参与到全民阅读中来的问题。
                </p>
                <h4>客户评价</h4>

                <p>
                  朝阳预借图书馆真正让市民感受到文字之美、尽享阅读的乐趣，为不同喜好的市民提供了丰富多彩的书籍种类和优质的阅读体验。扫码送书上门等活动更是给群众的阅读生活带来了不一样的阅读感受，使阅读真正来到人民身边，让社区阅读、全民阅读切实服务于人民。
                </p>
              </div>
            </li>
            <li class="main-item">
              <img src="../../public/img/hezuofang15.png" alt="郑州图书馆" />
              <div>
                <h3>郑州图书馆</h3>
                <h4>客户介绍</h4>
                <p>
                  郑州图书馆成立于1953年，占地76.383亩，总建筑面积72450平方米，为地下一层，地上五层，规划总藏书量240万册（件），设计阅览坐席3000个，设计日均接待读者量6000人次。郑州图书馆自1999年以来，连续五次被文化部评定为国家一级图书馆，已成为郑州市重要的文献信息中心、社会教育中心、文化休闲中心和学术研究中心之一。郑州图书馆新馆作为郑州城市新的文化地标，必将在完善城市公共文化服务设施，满足和丰富公众公共文化需求中发挥出积极的作用。
                </p>
                <h4>客户评价</h4>
                <p>
                  阅读是获取知识、增长智慧的重要方式，是传承文明、提高素质的重要途径。与掌阅精选的阅读项目合作也是积极响应国家倡导的“书香校园”项目的正向印证。在校内推广和使用精选产品期间，也使全校阅读理念在教职工和学生间更加深入人心，阅读活动的丰富内容，尤其是全校暑期“共读”活动，使阅读氛围更加浓厚、成效更加凸显。
                </p>
              </div>
            </li>
            <li class="main-item">
              <img src="../../public/img/hezuofang10.png" alt="中国评剧院" />
              <div>
                <h3>中国评剧院</h3>
                <h4>客户介绍</h4>
                <p>
                  客户介绍：中国评剧院成立于1955年，是文化部领导下的艺术团体。她的前身是1953年组建的隶属于中国戏曲研究院的中国评剧团。中国评剧院建院方针为：“以演现代戏为主的示范性剧院，同时上演新编历史剧和经过整理的优秀传统戏”。
                </p>
                <h4>客户评价</h4>
                <p>
                  剧院党委想通过阅读提高剧院演职员工综合素养，让阅读常态化，打造“艺德高尚、技艺精良、专业扎实”的高素质人才队伍。为更好的达到活动效果，丰富活动载体，此次读书活动采用线上、线下相结合形式开展。线上读书：选择读书APP根据剧院实际需求进行专业定制，为剧院党员、职工开设个人账号，个人可在APP中选择读物进行阅读，真正实现利用“碎片时间”完成“碎片化阅读”。
                </p>
              </div>
            </li>
            <li class="main-item">
              <img
                src="../../public/img/hezuofang4.png"
                alt="深圳市福田区总工会"
              />
              <div>
                <h3>深圳市福田区总工会</h3>
                <h4>客户介绍</h4>
                <p>
                  为深入贯彻党的十九大会议精神，推动学习型工会组织建设，打造书香工会，营造“多读书、读好书、善读书”的浓厚氛围和良好的学习之风。福田区总工会对全区职工书屋进行升级建设，打造“互联网+”工会、学习型书香工会。富职工业余生活、减轻工作压力，引导职工养成良好的阅读学习习惯，促进全民阅读，打造学习型组织。
                </p>
                <h4>客户评价</h4>
                <p>
                  为让职工享受数字阅读的便利，福田区总工会特采购了掌阅精选数字借阅一体机，并通过功能定制和内容定制，为职工学院大幅度降低了组织学成本，实现了“哪里有员工哪里就有职工书屋，哪里有员工哪里就有读书活动”，并带领全体职工共同读书，共享阅读之乐。
                </p>
              </div>
            </li>
            <li class="main-item">
              <img src="../../public/img/hezuofang6.png" alt="河北农家书屋" />
              <div>
                <h3>河北农家书屋</h3>
                <h4>客户介绍</h4>
                <p>
                  为深入贯彻落实中共中央、国务院《关于推进社会主义新农村建设的若干意见》和《关于进一步加强农村文化建设的意见》，2007年3月，新闻出版总署会同中央文明办、国家发展改革委、科技部、民政部、财政部、农业部、国家人口计生委联合发出了《关于印发〈农家书屋工程实施意见〉的通知》，开始在全国范围内实施“农家书屋”工程。
                </p>
                <h4>客户评价</h4>
                <p>
                  农家书屋切实解决了广大农民群众“买书难、借书难、看书难”的问题，满足了农民文化建设的具体需要，即在行政村建立的、农民自己管理的、能提供农民实用的书报刊和音像电子产品阅读视听条件的公益性文化服务设施。掌阅精选农家书屋为新农村文化建设提供了有力支持与保障。
                </p>
              </div>
            </li>
            <li class="main-item">
              <img
                src="../../public/img/hezuofang7.png"
                alt="黑龙江省农家书屋"
              />
              <div>
                <h3>黑龙江省农家书屋</h3>
                <h4>客户介绍</h4>
                <p>
                  黑龙江省为积极贯彻落实《农家书屋深化改革创新，提升服务效能实施方案》，推动农家书屋提质增效，助力乡村振兴战略实施，让全省市民真正的参与到全民阅读中，享受数字化阅读的便利。
                </p>
                <h4>客户评价</h4>

                <p>
                  为做标准书屋、优质书屋，掌阅精选为黑龙江省了农家书屋定制化搭建，采用H5端、APP端多种接入方式，书屋包含丰富的电子书、听书资源。并且掌阅精为农家书屋提供了主题性和常态化的阅读活动策划和支持，例如：上线宣传、悦读之星PK赛、线上线下海报、易拉宝等，提高书屋的使用效能，实现了其数字阅读+活动吸引的目标，有效的促进了本省的全面阅读，解决了农家书屋服务“最后一公里”等问题。
                </p>
              </div>
            </li>
          </ul>
          <ul class="universities"  v-else-if="i==3">
            <li class="main-item">
              <img
                src="../../public/img/hezuofang12.png"
                alt="国际关系学院数字图书馆"
              />
              <div>
                <h3>国际关系学院数字图书馆</h3>
                <h4>客户介绍</h4>
                <p>
                  由中华人民共和国教育部直属，为财政部6所“小规模试点高校“之一，是以外语、国际问题为教学科研的全国重点大学。多次受到党和国家领导人的重视和关怀，周恩来总理曾亲自批准建校并到校视察；江泽民总书记1994年亲笔题词：“努力把国际关系学院办成富有特色的一流大学”。
                </p>
                <h4>客户评价</h4>
                <p>
                  国际关系学院和掌阅精选的愉快合作，学校反馈产品技术对接和运营服务体贴周到，师生阅读体验非常好，部分功能还需改善，掌阅精选倾听客户声音，助力高校图书馆更好的使用。为师生提供完备的阅读学习资源，并充分发挥图书馆的知识传播属性，助力高校阅读创新新形式，提升师生阅读兴趣。
                </p>
              </div>
            </li>
          </ul>
          <div class="try">
            <h2>职工阅读，就用掌阅精选机构服务</h2>
            <span>申请30天免费试用</span>
            <!-- <img alt="掌阅精选机构服务" src="./img/shiyong.png"> -->
          </div>
        </div>
      </div>
    <footerd></footerd>
    <kefu></kefu>
  </div>
</template>

<style scoped>
/* 顶部导航css */
.center{
    width: 100%;
    margin: 0 auto;
    max-width: 1400px;
    min-width: 1200px;
  }
  .center .header{
    max-width: 1200px;
    height: 48px;
    line-height: 48px;
    margin: 0 auto;
    padding: 0 4rem;
    position: relative;
    z-index: 1;
    box-shadow: 0 1px 1px rgb(94  121  159 / 15%);
  }
  .logo{
    align-items: center;
    width: 115px;
    height: 48px;
    float: left;
    display: flex;
  }
  .logo > img{
    width: 100%;
    align-items: center;
  }
  .nav{
    padding-left: 90px;
    display: flex;
    width: 336px;
    height: 48px;
  }
  .nav .biao1 > p{
    width: 112px;
    height: 48px;
    text-align: center;
  }
  .biao1 ul{
    background-color: #fff;
    box-shadow: 
    1px -1px 2px rgb(94 121 159 / 15%), 
    1px 1px 2px rgb(94 121 159 / 15%), 
    1px 1px 2px rgb(94 121 159 / 15%), 
    -1px 1px 2px rgb(94 121 159 / 15%);
  }
  .header .nav div:hover p,.header .nav div:hover p > a{
    color: #5788d9;
    cursor: pointer;
  }
  .header .nav div:hover ul{
    display: block;
  }
  
  .header .nav div:nth-child(1) p, .header .nav div:nth-child(2) p{
    padding: 0rem 0.26rem;
    font-size: .14rem;
  }
  .header .nav div:nth-child(1) p::after, .header .nav div:nth-child(2) p::after{
    content: "";
    position: absolute;
    top: 19px;
    width: 0.6rem;
    height: 0.6rem;
    background: url(../../public/img/top_fangkuai.png);
    background-size: 100% 100%;
    transform:rotate(180deg) ;
  }
  .nav > .biao1 > p , .nav > .biao1  p > a,.nav > .biao1  li {
    font-size: 14px;
    color: #555555;
    text-decoration: none;
  } 
  .nav > .biao1  li {
    cursor: pointer;
  }
  .biao1>ul{
    list-style: none;
    line-height: 30px;
    text-align: center;
    display: none;
  }
  .you{
    top: 0px;
    left: 70%;
    position: absolute;
    display: flex;
  }
  .you a{
    text-decoration: none;
  }
  .you span{
    padding-right: 20px;
    display: block;
  }
  .you span a{
    color: #444444;
    font-size: 14px;
    text-align: center;
    color: #444;
    font-size: 15px;
  }
  .header .you span:hover a{
    color: #5788d9;
  }
  .nav_item i>img{
    display: none;
    width: 112px;height: 112px;
    border-radius: 5px;
    position: absolute;
    top: 50px;
    left: 50%;
    margin-left: -64px;
    border: 6px solid #f0f6fe;
    box-sizing: border-box;
  }
  .header .you span:hover i>img{
    display: block;
  }
  .btn:hover{
    background-color: #007aff;
    cursor: pointer;
  }
  .btn{
    width: 84px;height: 32px;
    font-size: 14px;
    line-height: 32px;
    color: #fff;
    display: inline-block;
    border-radius: 16px;
    text-align: center;
    margin-left: .6rem;
    background-color: #5788d9;
    border: 0px;
    margin-top: 10px;
  }


/* service页面css */
#case {
  margin: 0 auto;
}
.tabBar {
  text-align: center;
}
.tabBar > li {
  margin: 0 50px;
  display: inline;
  cursor:pointer;
}
.tabBar > li:hover {
  border-bottom: 3px solid #007aff;
}
.banner {
  width: 1200px;
  height: 360px;
  margin: 0 auto;
  margin-bottom:10px;
  background-color: rgba(223, 223, 223, 0.2);
  display: flex;
  justify-content: space-between;
}
.banner div {
  margin-left: 100px;
  margin-top: 100px;
}
.banner div h1 {
  margin-bottom: 12px;
  font-weight: 400;
  font-size: 40px;
}
.banner div p {
  margin-bottom: 36px;
  font-weight: 400;
  font-size: 22px;
  color: grey;
}
.banner div span {
  display: inline-block;
  line-height: 50px;
  text-align: center;
  border-radius: 25px;
  font-weight: 400;
  font-size: 16px;
  width: 152px;
  height: 50px;
  background-color: #5788d9;
  color: white;
}
#case > .main > .company {
  display: flex;
  flex-direction: column;
}
#case > .main > .administration {
  display: flex;
  flex-direction: column;
}
#case > .main > .universities {
  display: flex;
  flex-direction: column;
}
.company > .main-item {
  display: flex;
  justify-content: space-between;
  width: 1200px;
  margin: 0 auto;
  padding: 60px 0;
}
.company > .main-item > img {
  padding-top: 30px;
  width: 240px;
  height: 240px;
}
.company > .main-item > div > h4 {
  font-weight: 400;
  margin-top: 15px;
  margin-bottom: 15px;
}
.company > .main-item > div {
  width: 864px;
}
.administration > .main-item {
  display: flex;
  justify-content: space-between;
  width: 1200px;
  margin: 0 auto;
  padding: 60px 0;
}
.administration > .main-item > img {
  padding-top: 30px;
  width: 240px;
  height: 240px;
}
.administration > .main-item > div > h4 {
  font-weight: 400;
  margin-top: 15px;
  margin-bottom: 15px;
}
.administration > .main-item > div {
  width: 864px;
}
.universities > .main-item {
  display: flex;
  justify-content: space-between;
  width: 1200px;
  margin: 0 auto;
  padding: 60px 0;
}
.universities > .main-item > img {
  padding-top: 30px;
  width: 240px;
  height: 240px;
}
.universities > .main-item > div > h4 {
  font-weight: 400;
  margin-top: 15px;
  margin-bottom: 15px;
}
.universities > .main-item > div {
  width: 864px;
}
#case > .main > .try {
  margin: 0 auto;
  text-align: center;
  width: 1200px;
  height: 310px;
  background-image: url(../../public/img/shiyong.png);
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: right;
  background-size: contain;
}
#case > .main > .try > h2 {
  margin-bottom: 28px;
  font-size: 32px;
  font-weight: 400;
}
#case > .main > .try > img {
  width: 328px;
  height: 241px;
}
#case > .main > .try > span {
  display: inline-block;
  line-height: 50px;
  text-align: center;
  border-radius: 25px;
  font-weight: 400;
  font-size: 16px;
  width: 250px;
  height: 48px;
  background-color: #5788d9;
  color: white;
}
</style>

<script>
import kefu from '@/components/kefu.vue'

export default {
  data(){
    return { i:1 }
  },
  components:{ kefu },
  methods:{
    huan(i){
      this.i=i;
    }
  }
}
</script>